<template>
  <div class="container" @click="lookDetail(article.id)">
    <div class="title">{{article.title}}</div>
    <div class="type">
        #{{article.categoryName}}  {{article.create_time}}
    </div>
  </div>
</template>

<script>
export default {
    props: {
        article:{
            type: Object,
            required: true
        }
    },
    methods: {
        lookDetail(id) {
            this.$router.push("/detail?id=" + id)
        }
    }
}
</script>

<style lang="scss" scoped>
.container {
    padding: 10px;
    border-bottom: 1px solid rgba(188, 185, 185, 0.5);
    cursor: pointer;
    .title {
        font-size: 16px;
        color: #333;
        line-height: 16px;
        margin-bottom: 6px;
    }
    .type {
        font-size: 12px;
        color: #999
    }
}
</style>